<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=yes">
    <meta http-equiv="Content-type" content="text/html;charset=UTF-8">
    <meta name="description" content="Visualize antennae for telecommunications mobile network operators, colored by technology and by azimuth">
    <title>Visualize Mobile Network Antennae by Technology</title>
    <link rel="stylesheet" type="text/css" href="https://js.api.here.com/v3/3.0/mapsjs-ui.css" />
		<link rel="stylesheet" type="text/css" href="css/example.css" />
    <script type="text/javascript" src="https://js.api.here.com/v3/3.0/mapsjs-core.js"></script>
		<script type="text/javascript" src="https://js.api.here.com/v3/3.0/mapsjs-service.js"></script>
		<script type="text/javascript" src="https://js.api.here.com/v3/3.0/mapsjs-ui.js"></script>
		<script type="text/javascript" src="https://js.api.here.com/v3/3.0/mapsjs-mapevents.js"></script>
		<script type="text/javascript" src="https://js.api.here.com/v3/3.0/mapsjs-clustering.js"></script>
		<script type="text/javascript" src="https://d3js.org/d3.v4.0.0-alpha.50.min.js"></script>
		<script type="text/javascript" src="https://js.datalens.api.here.com/2.0.0/mapsjs-datalens.js"></script>
  </head>
  <body>
    <h1>Visualize Mobile Network Antennae by Technology</h1>
    <p><div>This example displays a visualization of mobile network antennae on a map. We introduce the concept of the Data Lens REST API query which is used to fetch and process the data, and then demonstrate how the Data Lens JavaScript libraries are used to produce the visualization.<br><br>The dataset used for the visualization contains antenna attributes such as its location, direction ("azimuth") and technology. (Note that the actual data used here is simulated.) Each antenna symbol is designed as follows:<br><br></div><ul><li>Antennae are displayed as one or more line segments, each of a solid color.</li><li>Each segment represents a cell.</li><li>The direction of the segment is the azimuth of the cell.</li><li>Different colors represent the cell technologies.</li><li>The dot in the middle of the symbol represents the antenna's location.</li></ul>The end-user will be able to control the visibility of cells by toggling the cell technology (2G, 3G, 4G) in the viewport.<br></p>
		<div id="map" style="width: 600px; height: 400px; background: grey"></div>
    <script type="text/javascript" src='js/app.js'></script>
  </body>
</html>
